//点赞组件,组件需要绑定域才有效果
Vue.component('like',{
    //模板
    template: '<button :class="{liked:liked}" @click="toggle_like()">赞 {{ like_count }}</button>',
    //组件里面的data不能是一个对象, 是一个方法
    data: function(){
        return {
            like_count:10,
            liked: false,
        }
    },
    methods:{
        toggle_like: function () {
            //当前没有点赞, 再++,然后改变状态, 下次不再执行
            if ( !this.liked )
            //点一下,数字加1
               this.like_count++;      //当前没有点赞, 再++
            else
                this.like_count--;      //取消点赞
            this.liked = !this.liked      //改变状态, 下次不再执行
        }
    }
})
//上面只是加载了组件, 还没有用上, 需要渲染出来
new Vue({
    el:"#app",
});
